<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>用户信息</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="bootstrap-3.3.7-dist/css/bootstrap.css" rel="stylesheet">
<script src="style/js/jquery-1.11.1.js"></script>
<script src="bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<script type="text/javascript" src="style/js/pop-ico.js"></script>
<script src="https://cdn.bootcss.com/jquery-validate/1.15.0/messages_zh.js"></script>
<script src="https://cdn.bootcss.com/jquery-validate/1.15.0/jquery.validate.js"></script>
<script src="https://cdn.bootcss.com/jquery-validate/1.15.0/additional-methods.js"></script>

<style type="text/css">
#toprow {
	
}

#topcolumn {
	padding: 0px;
}

.container {
	margin: 0px;
	width: 100%;
	height:100%;
}

.leftbutton {
	margin: 0px;	
	padding-top:10px;
	padding-bottom:50px;
	padding-left:20px;
	cursor: pointer;
}

.leftbutton:hover {
	background-color: #46A3FF	
}

.buttoncss {
	float: left;
	
	/* margin-top:10px;
	margin-bottom:10px;
	margin-left:20px; */
}

.buttoncss:hover {
	background-color: #46A3FF
}

.buttonword{
	margin-left:10px;
	margin-top:8px;
 	height:40px;
	color:#FFFFFF;
	float: right;
}

.cmt-ico .head-ico img {
	border: 1px dashed #F60;
	padding: 2px;
}

.pop-ico {
	position: absolute;
	width: 850px;
	min-height: 420px;
	top: -230px;
	left: -300px;
	background: #FFF;
	border: 1px solid #D7D7D7;
	z-index: 100
}

.pop-ico .ico-title {
	height: 20px;
	background-color: #F0F0F0;
	color: #0078B6;
	padding-top: 5px;
	padding-left: 5px;
	padding-right: 5px
}

.pop-ico .ico-title a {
	cursor: pointer;
	display: block;
	width: 15px;
	height: 15px;
	text-align: center;
	position: absolute;
	right: 5px;
	top: 5px;
}

.pop-ico .ico-list {
	padding: 7px
}

.pop-ico .ico-list a img {
	border: 1px dashed #DDD;
	cursor: pointer;
}

.pop-ico .ico-list a:hover img, .pop-ico .ico-list .cur img {
	border: 1px dashed #F60;
}

</style>
<script type="text/javascript">
$(function(){
	$('#changeuserinfo').click(function(){
		$.post("changeuserinfo.do",
				{
			     	username:$('#username').val(),
			     	department:$('#department').val(),
			     	duty:$('#duty').val(),
			     	address:$('#address').val(),
			     	qq:$('#qq').val(),
			     	aboutme:$('#aboutme').val(),
			     	tel:$('#tel').val(),
			     	head:$('#head').val(),
				},function(data){
					if(data){
						alert("修改成功");
					}else{
						alert("修改失败");
					}
				},"json" 
		); 
	});

//-------------------初始加载事件↑--------------------------表单↓---------------------------------------------------


	
//---------------任务↑---------------------------活动↓-------------------------------------	
	

	

});
function choseheadimage(src) {
	$("#head").val(src);
}


</script>

</head>
<body>
	<div class="container">
		<!-- 顶部导航栏 -->
		<div id="toprow" class="row clearfix">
			<div id="topcolumn" class="col-md-12 column">
				<nav style="margin: 0px" class="navbar navbar-default"
					role="navigation">
					<div class="navbar-header">
						<img style="width: 75px; height: 40px"
							src="style/image/ateamlogo.png">
						<!-- <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button> <a class="navbar-brand" href="#">Brand</a> -->
					</div>

					<div class="collapse navbar-collapse"
						id="bs-example-navbar-collapse-1">
						<ul class="nav navbar-nav">
							<li><h4>${currentCompany.companyname}</h4></li>
						</ul>

						<ul class="nav navbar-nav navbar-right">
							<li>
								<form class="navbar-form navbar-left" role="search">
									<div class="form-group">
										<input type="text" class="form-control" />
									</div>
									<button type="submit" class="btn btn-default">Submit</button>
								</form>
							</li>
							<li>
								<c:if test="${currentUser.role == 1}">
							 <button onclick="javascript:location.href='getapplyers.do'" class="btn btn-small" type="button">申请</button>
							 	</c:if>
							 	<c:if test="${currentUser.role == 2}">
							 <button onclick="javascript:location.href='getapplyers.do'" style="display:none;" class="btn btn-small disabled" type="button">申请</button>
							 	</c:if>
							 </li>
							 <li>
							<button onclick="javascript:location.href='logout.do'" class="btn btn-success" type="button">注销</button>
							</li>
						</ul>
					</div>

				</nav>
			</div>
		</div>

		<!-- 主体 -->
		<div class="row clearfix">
			<!-- 左边的按钮列表 -->
			<div style="padding: 0px; margin-bottom:0px;background-color: #84C1FF"
				class="col-md-1 column">
				<div style="padding:5px;height:180px;background-color: #46A3FF" class="leftbutton"><div><img style="height:100px;width:100px;cursor: pointer;" src="${currentUser.head}"><h1>${currentUser.username}</h1></div></div>
				<div class="leftbutton" onclick="javascript:location.href='home.jsp'"><div class="buttoncss"><img src="style/image/ico/动态.png"><div class="buttonword">动态</div></div></div>
				<div class="leftbutton" onclick="javascript:location.href='backlog.jsp'"><div class="buttoncss"><img src="style/image/ico/待办.png"><div class="buttonword">待办</div></div></div>
				<div class="leftbutton" onclick="javascript:location.href='project.jsp'"><div class="buttoncss"><img src="style/image/ico/项目.png"><div class="buttonword">项目</div></div></div>
				<div class="leftbutton" onclick="javascript:location.href='group.jsp'"><div class="buttoncss"><img src="style/image/ico/小组.png"><div class="buttonword">小组</div></div></div>
				<div class="leftbutton" onclick="javascript:location.href='getcolleagues.do'"><div class="buttoncss"><img src="style/image/ico/同事.png"><div class="buttonword">同事</div></div></div>
				<div class="leftbutton" onclick="javascript:location.href='approval.jsp'"><div class="buttoncss"><img src="style/image/ico/审批.png"><div class="buttonword">审批</div></div></div>
				<div class="leftbutton" onclick="javascript:location.href='gotochart.do'"><div class="buttoncss"><img src="style/image/ico/报表.png"><div class="buttonword">报表</div></div></div>
			</div>

			<!-- 右边的内容  这里修改了bootstrap.css中关于滚动条的长度-->
			<div class="col-md-11 column pre-scrollable">
				<div class="col-md-4 column"></div>
				<div class="col-md-4 column">
					<form id="registerform" method="post" role="form">
							<div class="form-group">
								<label>用户名</label><input
									placeholder="${currentUser.username}" class="form-control" value="${currentUser.username}"
									name="username" id="username" />
							</div>
							<div class="form-group">
								<label>部门</label><input
									placeholder="${currentUser.department}" class="form-control" value="${currentUser.department}"
									name=department id="department" />
							</div>
							<div class="form-group">
								<label>职位</label><input
									placeholder="${currentUser.duty}" class="form-control" value="${currentUser.duty}"
									name="duty" id="duty" />
							</div>	
							<div class="form-group">
								<label>地址</label><input
									placeholder="${currentUser.address}" class="form-control" value="${currentUser.address}"
									name="address" id="address" />
							</div>
							<div class="form-group">
								<label>QQ</label><input
									placeholder="${currentUser.qq}" class="form-control" value="${currentUser.qq}"
									name="qq" id="qq" />
							</div>
							<div class="form-group">
								<label>自我介绍</label><input
									placeholder="${currentUser.aboutme}" class="form-control" value="${currentUser.aboutme}"
									name="aboutme" id="aboutme" />
							</div>
							<div class="form-group">
								<label>TEL</label><input
									placeholder="${currentUser.tel}" value="${currentUser.tel}" class="form-control" name="tel" id="tel" />
								<input class="form-control" name="head" id="head" value="style/image/head/profileico1.jpg"
									style="visibility: hidden; display: none;" />
							</div>
							<div class="form-group">
								<label for="exampleInputFile">选择头像</label>
								<div class="cmt-ico" style="position: relative">
									<a class="head-ico show-ico-btn" title="选择头像"><img
										class="focus-ico" src="style/image/head/profileico1.jpg"
										alt="选择头像" width="200" height="200">
									</a>
									<!-- 弹出窗口  start-->
									<div class="pop-ico" style="display: none">
										<div class="ico-title">
											<span>选择头像</span> <a title="关闭窗口" class="hide-ico-btn">x</a>
										</div>
										<div class="ico-list">
											<a data-src="style/image/head/profileico1.jpg" class="cur"><img
												src="style/image/head/profileico1.jpg" width="200"
												onclick="choseheadimage('style/image/head/profileico1.jpg')"
												height="200"></a> <a
												data-src="style/image/head/profileico2.jpg"><img
												src="style/image/head/profileico2.jpg" width="200"
												onclick="choseheadimage('style/image/head/profileico2.jpg')"
												height="200"></a> <a
												data-src="style/image/head/profileico3.jpg"><img
												src="style/image/head/profileico3.jpg" width="200"
												onclick="choseheadimage('style/image/head/profileico3.jpg')"
												height="200"></a> <a
												data-src="style/image/head/profileico4.jpg"><img
												src="style/image/head/profileico4.jpg" width="200"
												onclick="choseheadimage('style/image/head/profileico4.jpg')"
												height="200"></a> <a
												data-src="style/image/head/profileico5.jpg"><img
												src="style/image/head/profileico5.jpg" width="200"
												onclick="choseheadimage('style/image/head/profileico5.jpg')"
												height="200"></a> <a
												data-src="style/image/head/profileico6.jpg"><img
												src="style/image/head/profileico6.jpg" width="200"
												onclick="choseheadimage('style/image/head/profileico6.jpg')"
												height="200"></a> <a
												data-src="style/image/head/profileico7.jpg"><img
												src="style/image/head/profileico7.jpg" width="200"
												onclick="choseheadimage('style/image/head/profileico7.jpg')"
												height="200"></a> <a
												data-src="style/image/head/profileico8.jpg"><img
												src="style/image/head/profileico8.jpg" width="200"
												onclick="choseheadimage('style/image/head/profileico8.jpg')"
												height="200"></a>
										</div>
									</div>
									<!-- 弹出窗口  end-->
								</div>
							</div>
							<button id="changeuserinfo" class="btn btn-default">Submit</button>
						</form>
					</div>
				<div class="col-md-4 column"></div>	
			</div>
		</div>
	</div>
</body>
</html>